【前言】
前兩篇我們介紹了action
和reducer
,這次不多說廢話直接進到正文吧!
【正文】
前面一直強調action是描述發生什麼事的物件,reducer是改變state真正執行的函式,並回傳最新的狀態,那這些狀態到底是放在哪裡啊?就是store
中。
The Store is the object that brings action and reducer together.
store
主要的功能就是掌管應用程式的狀態,並且有這些任務:
getState()
讀取statedispatch(action)
來更新statesubscribe(listener)
註冊listenersubscribe(listener)
回傳的function註銷listener 在redux的應用程式中,你的store
只會有一個而已。
創建state的方法就是利用createStore(reducer)
的方式創建它,而要發送action則利用dispatch(action)
來達到,當store
收到action
時,則會呼叫reducer
來幫忙更新state囉。
import { createStore } from 'redux';
import { addTodo } from './actions'
import todoApp from './reducers';
// 利用createStore()創建store的state
const store = createStore(todoApp);
// Dispatch 一些 action
store.dispatch(addTodo('Learn about actions'));
store.dispatch(addTodo('Learn about reducers'));
這樣子就可以算是一個小型的redux應用程式囉!
這篇真的是,講超少的XDDDD(超懶惰 哈~